<!DOCTYPE html>
<html lang="zh-cn">
<head>
	<meta charset="utf-8" />
	<title>倒影特效</title>
	<style>
        .box{
			width: 500px;
			height: 50px;
			text-align: center;
			margin: 0 auto;
			font-size: 40px;
			background: url(./webChat.png) no-repeat;
			-webkit-box-reflect: below 16px -webkit-linear-gradient(transparent,transparent 50%,rgba(255,255,255,0.6));
		}

	</style>
</head>

<body>

	<div class="box" style="background-color:bisque">
		测试文字ABC
	</div>

</body>

</html>
